<div class="layui-fluid" id="VIEW-list-table" lay-title="表格列表">
  <div class="layui-row layui-col-space12">
    <div class="layui-col-md12">
      <div class="layui-card">
        <div class="layui-card-body nepadmin-table-full">
          <div class="layui-btn-container nepadmin-pad-t10 nepadmin-pad-l10">
            <div class="layui-btn layui-btn-sm" lay-popup="{url:'/list/treeForm',area:['520px', '418px']}">添加商品</div>
            <div class="layui-btn layui-btn-sm layui-btn-primary table-action" data-type="lower" id="addTableSelect">下架</div>
            <div class="layui-btn layui-btn-sm layui-btn-primary table-action" data-type="del" lay-popup="{url:'/list/checkSelectForm',area:['1000px', '518px']}">删除</div>
            <div class="layui-btn layui-btn-sm layui-btn-primary table-action" data-type="move">移动分类</div>
            <div class="layui-btn layui-btn-sm layui-btn-primary action-more">
              <i class="layui-icon">&#xe875;</i>
            </div>
          </div>

          <!--<table id="list-table" lay-filter="list-table"></table>-->
          <table class="layui-hidden" id="treeTable" lay-filter="treeTable"></table>
        </div>
      </div>
    </div>

  </div>

</div>
<script>
    var menuId="",parentMenuId="";
    var editObj=null,ptable=null,treeGrid=null,tableId='treeTable',layer=null,api=null;
    layui.use(['jquery','treeGrid','conf','view','api','layer','admin'], function(){
        var view = layui.view;
        var $=layui.jquery;
        treeGrid = layui.treeGrid;//很重要
        layer=layui.layer;
        var admin = layui.admin;

        ptable=treeGrid.render({
            id:tableId
            ,elem: '#'+tableId
            ,url:'/sysMenu/list?token='+admin.loginToken
            ,cellMinWidth: 100
            ,idField:'menuId'//必須字段
            ,treeId:'menuId'//树形id字段名称
            ,treeUpId:'parentId'//树形父id字段名称
            ,treeShowName:'name'//以树形式显示的字段
            ,heightRemove:[".dHead",10]//不计算的高度,表格设定的是固定高度，此项不生效
            ,height:'100%'
            ,isFilter:false
            ,iconOpen:false//是否显示图标【默认显示】
            ,isOpenDefault:true//节点默认是展开还是折叠【默认展开】
            ,loading:true
            ,method:'get'
            ,cols: [[
                /*{type:'numbers',title:'序号'}
                ,{type:'radio'}*/
                {type:'checkbox',sort:true}
                ,{field:'name', width:300, title: '菜单名称',edit:'text',sort:true}
                ,{field:'menuId',width:100, title: 'id',sort:true}
                ,{field:'parentId', title: 'pid',sort:true,edit:'text'}
                ,{width:150,title: '操作', align:'center'/*toolbar: '#barDemo'*/
                    ,templet: function(d){
                        var html='';
                        var addBtn='<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="add">添加</a>';
                        var editBtn='<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">编辑</a>';
                        var delBtn='<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>';
                        return addBtn+editBtn+delBtn;
                    }
                }
            ]]
            ,isPage:false
            ,parseData:function (res) {//数据加载后回调
                return res;
            }
            /*,onClickRow:function (index, o) {
                console.log(index,o,"单击！");
            }
            ,onDblClickRow:function (index, o) {
                console.log(index,o,"双击");
            }*/
        });

        treeGrid.on('tool('+tableId+')',function (obj) {
            if(obj.event === 'del'){//删除行
                del(obj);
            }else if(obj.event==="add"){//添加行
                // add(obj);
                // 新增菜单
                menuId = "";
                parentMenuId = obj.data.menuId;
                admin.popup({
                      url:'/sys/menu/sysMenuEdit',
                      area:['650px', '450px']
                    }
                )
                return false
            }else if(obj.event==="edit"){
                parentMenuId="";
                menuId=obj.data.menuId;
                admin.popup({
                        url:'/sys/menu/sysMenuEdit',
                        area:['650px', '450px']
                    }
                )
                return false
            }
        });

        treeGrid.on('edit(treeTable)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
            console.log(obj.value); //得到修改后的值
            console.log(obj.field); //当前编辑的字段名
            console.log(obj.data); //所在行的所有相关数据
        });

        $("#addTableSelect").on("click",function(){
            layer.open({
                type: 2,
                title: '信息',
                shadeClose: true,
                shade: 0.8,
                area: ['780px', '500px'],
                content: '/nepadmin/views/list/tableSelectForm.html'
            });
        });
    });

    function del(obj) {
        layer.confirm("你确定删除数据吗？如果存在下级节点则一并删除，此操作不能撤销！", {icon: 3, title:'提示'},
            function(index){//确定回调
                obj.del();
                layer.close(index);
            },function (index) {//取消回调
                layer.close(index);
            }
        );
    }

    var i=1000000;
    //添加
    function add(pObj) {
        var pdata=pObj?pObj.data:null;
        var param={};
        param.name='水果'+Math.random();
        param.id=++i;
        param.pId=pdata?pdata.id:null;
        treeGrid.addRow(tableId,pdata?pdata[treeGrid.config.indexName]+1:0,param);
    }

</script>